<!--
 * @LastEditors: 七七
 * @Date: 2023-01-11 09:48:47
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>数组的方法</title>
</head>

<body>
  <script>
    var arr = ['a', 'b', 'c', 'd'];

    // 向末尾添加元素，返回数组的新的长度
    // 将数组新长度作为返回值返回
    var result = arr.push('t')
    console.log(arr); // [ "a", "b", "c", "d", "t" ]
    console.log(result); //5

    // 删除数组最后一个元素
    // 将被删除的元素作为返回值返回
    var result = arr.pop();
    console.log(arr); //[ "a", "b", "c", "d" ]
    console.log(result); //t

    // 向开头添加元素，返回数组的新的长度
    // 将数组新长度作为返回值返回
    var result = arr.unshift('tt');
    console.log(arr); //[ "tt", "a", "b", "c", "d" ]
    console.log(result); //5

    // 删除数组第一个元素
    // 将被删除的元素作为返回值返回
    var result = arr.shift();
    console.log(arr); //[ "a", "b", "c", "d" ]
    console.log(result); //tt

    // 从数组中提取指定元素
    // 该方法不会改变元素数组，将截取到的元素封装到一个新数组中返回
    // 参数:1.start截取开始位置的索引 2.end截取结束位置的索引
    var result = arr.slice(0, 1);
    console.log(arr); //[ "a", "b", "c", "d" ]
    console.log(result); //[ "a" ]

    // 删除数组中指定的元素
    // 影响原数组，会将指定元素从原数组中删除，并将删除的元素作为返回值返回
    // 参数：
    // 1.两个参数：第一个表示开始位置的索引，第二个表示删除的数量
    // 2.三个参数：第一个表示开始位置的索引，第二个表示删除的数量，第三个表示在开始位置前面插上新的元素
    var result = arr.splice(0, 1);
    console.log(arr); //[ "b", "c", "d" ]
    console.log(result); //[ "a" ]
    var result = arr.splice(0, 1, 'i');
    console.log(arr); //[ "i", "c", "d" ]
    console.log(result); //[ "b" ]

    // 连接数组，不会对原数组产生影响
    var arr = ['q', 's', 's'];
    var color = ['red', 'pink'];
    var result = arr.concat(color);
    console.log(result); //[ "q", "s", "s", "red", "pink" ]

    // 将数组转换成一个字符串
    // 不会对原数组产生影响
    // 在join中指定一个字符串作为参数，这个字符串会成为数组元素的连接符（默认','）
    var result = arr.join();
    console.log(arr); // [ "q", "s", "s" ]
    console.log(result); //q,s,s
  </script>
</body>

</html>